import 'package:find_friend/const/const.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

class LoginTextField extends StatefulWidget {

  final TextEditingController controller;
  final String placeholder;
  final bool obscureText;
  final int maxlength;
  final double marginTop;
  final bool isshowclear;
  final List<TextInputFormatter> inputFormatters;
  final FocusNode focusNode;
  final TextInputType keybordType;
  final Function(String phone) callback;
  final Function suffixTap;
  final String suffixIconName;
  final double height;

  const LoginTextField({Key key, 
  this.marginTop = 0,
  this.height = 40,
  this.controller, 
  this.placeholder = "请输入", 
  this.isshowclear = false,
  this.obscureText = false,
  this.maxlength = -1,
  this.inputFormatters,
  this.keybordType,
  this.callback,
  this.focusNode,
  this.suffixTap,
  this.suffixIconName = "assets/zhuce-x.png"
  }) : super(key: key);

  @override
  _LoginTextFieldState createState() => _LoginTextFieldState();
}

class _LoginTextFieldState extends State<LoginTextField> {
  
  bool isshowclear = false;
  int phoneLength = 0;
  String normalImgName = "assets/zhuce-x.png";
  
  @override
  void initState() {
    super.initState();
    if(widget.focusNode != null){
      widget.focusNode.addListener(() { 
        if(this.mounted){
          setState(() {
            isshowclear = widget.focusNode.hasFocus;
          });
        }
      });
    }

    setState(() {
      isshowclear = widget.isshowclear;
    });
  }

  @override
  void dispose() {
    if(widget.focusNode != null)widget.focusNode.removeListener(() { });
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
                height: widget.height,
                margin: EdgeInsets.only(top: widget.marginTop),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(20),
                  border: Border.all(color: Colors.transparent, width: 1.5)
                ),
                child: TextField(
                  maxLength: widget.maxlength,
                  controller: widget.controller,
                  obscureText: widget.obscureText,
                  autocorrect: false,
                  focusNode: widget.focusNode,
                  keyboardType: widget.keybordType,
                  inputFormatters: widget.inputFormatters,
                  decoration: InputDecoration(
                    hintStyle: instanceTextStyle(11, const Color(0xff999999)),
                    hintText: widget.placeholder,
                    labelStyle: instanceTextStyle(11, APP_font_black),
                    focusedBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(widget.height / 2.0)),
                      borderSide: BorderSide(width: 1.5, color: Colors.black),
                    ),
                    enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(widget.height / 2.0)),
                      borderSide: BorderSide(width: 1.5, color: Colors.black),
                    ),
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(widget.height / 2.0)),
                      borderSide: BorderSide(width: 1.5, color: Colors.black),
                    ),
                    suffixIcon: isshowclear ? IconButton(
                      icon: Image.asset((phoneLength == 11 && widget.suffixTap != null) ? widget.suffixIconName : normalImgName),
                      onPressed: (){
                        // 如果没有实现右边按钮的点击事件，就是清除内容事件
                        if(widget.suffixTap == null) {
                          widget.controller.clear();
                          if(widget.callback != null) widget.callback(widget.controller.text);
                        } else {
                          if(widget.suffixTap != null && widget.controller.text.length == 11){
                            widget.suffixTap();
                          } else {
                            widget.controller.clear();
                          }
                        }
                      }
                    ): null,
                    counterText: "",
                    contentPadding: const EdgeInsets.only(left: 27)
                  ),
                  onTap: (){
                    setState(() {
                      isshowclear = true;
                    });
                  },
                  onChanged: (str){ // 输入验证码的时候需要
                    if(widget.callback != null) widget.callback(str);
                    setState(() {
                      phoneLength = str.length;
                    });
                  },
                  onEditingComplete: (){
                    widget.focusNode.unfocus();
                    setState(() {
                      isshowclear = false;
                    });
                    if(widget.callback != null) widget.callback(widget.controller.text);
                  },
                ),
              );
  }
}